<template>
  <div>
    <div v-for="(item,index) in ins" :key="index" class="dog">
      <img :src="item.dogImgUrl">
      <p @click="add(item)">{{item.dogName}}</p>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {}
  },
  props: ['ins'],

  created () {},

  methods: {
    add (item) {
      this.$emit('Add', item.dogName)
    }
  }
}
</script>

<style scoped lang="less">
.dog{
  float: left;
  width: 350px;
  height: 250px;
  img{
    width: 350px;
    height: 180px;
  }
  p{
    text-align: center;
  }
}
</style>
